<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/taglibs.jsp"%>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>收费登记</title>
<%@ include file="/commons/validation.jsp"%>
<script type="text/javascript" src="${ctx}/scripts/common.js"></script>
<script language="JavaScript"  src="${ctx}/scripts/div/common.js"></script>
<script type="text/javascript" src="${ctx}/scripts/ajaxException.js"></script>


<link href="${ctx}/styles/listTable.css" rel="stylesheet" type="text/css">
<link href="${ctx}/styles/aux_window.css" rel="stylesheet" type="text/css">
<link href="${ctx}/scripts/grid.css" rel="stylesheet" type="text/css">
<link href="${ctx}/styles/show.css" rel="stylesheet" type="text/css" />
<script language="JavaScript" type="text/javascript" src="${ctx}/scripts/listTable.js"></script>
<script language="JavaScript" type="text/javascript" src="${ctx}/scripts/global.js"></script>
<script language="JavaScript" type="text/javascript" src="${ctx}/scripts/public.js"></script>
<script type="text/javascript" src="${ctx}/scripts/tags/checkbox/checkbox.js"></script>
<script type="text/javascript" src="${ctx}/scripts/tags/unitedselect/UnitedSelect.js"></script>

<script>
	function resize(){
		parent.window.document.all('reqChargeIfm').style.height=document.body.scrollHeight;
	}
//---------------------------复选框-------------------

	function ckOnclick(keyword){//单击复选框
		var ckId = "ckS_"+keyword;	//复选框
		var spId = "spS_"+keyword;	//状态显示层
		var FSId = "FS_"+keyword;	//状态值
		var remarkId = "remark_"+keyword; //备注
		var sumId = "sum_"+keyword; //新输入的金额值
		var oldSumId = "oldSum_"+keyword; //原金额值

		if ($(ckId).checked){

			$(FSId).value = '001';
			$(spId).innerText = "未收";
			Validation.removeElmValidate(remarkId);
			$(remarkId).className = "inputNoStyle1  max-length-100";

			$(sumId).readOnly="";
		}else{
			$(FSId).value = '002';
			$(spId).innerText = "免收";
			$(remarkId).focus();
			$(remarkId).className = "inputOver1 required  max-length-100";

			$(sumId).readOnly="true";
			$(sumId).value=$(oldSumId).value;
			$(sumId).fireEvent("onblur");
		}
	}

//---------------------------备注----------------------

	function remarkOver(keyword){//鼠标从备注输入框移入

		var ckId = "ckS_"+keyword;	//复选框
		var spId = "spS_"+keyword;	//状态显示层
		var FSId = "FS_"+keyword;	//状态值
		var remarkId = "remark_"+keyword; //备注

		if (!$(ckId).checked){
			$(remarkId).className = 'inputOver1 required  max-length-100';
			$(remarkId).focus();
		}else{
			$(remarkId).className = 'inputOver1 max-length-100';
			$(remarkId).focus();
		}
	}

	function remarkOut(keyword){//鼠标从备注输入框移出
		var ckId = "ckS_"+keyword;	//复选框
		var spId = "spS_"+keyword;	//状态显示层
		var FSId = "FS_"+keyword;	//状态值
		var remarkId = "remark_"+keyword; //备注
		var sumId = "sum_"+keyword; //新输入的金额值
		var oldSumId = "oldSum_"+keyword; //原金额值

		var remardValue=$(remarkId).value;
		if (remardValue.trim()== ""){
				$(remarkId).value="";
			}

		if (!$(ckId).checked){

			if (remardValue.trim() == ""){
				$(remarkId).className = 'inputOver1 required max-length-100';
			}else{
				Validation.removeElmValidate(remarkId);
				$(remarkId).className = 'inputNoStyle1  required  max-length-100';
			}
		}else{
			Validation.removeElmValidate(remarkId);
			$(remarkId).className = 'inputNoStyle1 max-length-100';
		}

		if($(sumId).value != $(oldSumId).value){

			$(remarkId).className = 'inputOver1 required  max-length-100';
		}

		$(remarkId).fireEvent("onblur");
	}

//---------------------------金额------------------------

	function sumOver(keyword){ //鼠标移入 金额框中
		var ckId = "ckS_"+keyword;	//复选框
		var sumId = "sum_"+keyword; //新输入的金额值
		if($(ckId).checked){
			$(sumId).className = "inputOver1 required float-right integer-decimal-range-10-2";
		}
	}

	function sumOut(keyword){ //鼠标移出 金额框中
		var sumId = "sum_"+keyword; //新输入的金额值
		var oldSumId = "oldSum_"+keyword; //原金额值
		var remarkId = "remark_"+keyword; //备注

		$(sumId).className = "inputNoStyle1 required float-right integer-decimal-range-10-2";
		if($(sumId).value != $(oldSumId).value){
			$(remarkId).className = 'inputOver1 required  max-length-100';
		}
	}
//-------------------------------------------------------
	function submitWin(){

		var isTrue=$("reqChargeForm").fireEvent("onSubmit");
		if(!isTrue)
			return;

			setButtonStatus(false);

		var tableObj = document.getElementById("item_table");
		var checkBoxArray = tableObj.getElementsByTagName("tr");
		var selectedId = new Array();

		var itemPer = "";

		for(var i = 0; i < checkBoxArray.length; i++){
			var keyword = checkBoxArray[i].id;
			var ckId = "ckS_"+keyword;	//复选框
			var spId = "spS_"+keyword;	//状态显示层
			var FSId = "FS_"+keyword;	//状态值
			var remarkId = "remark_"+keyword; //备注
			var sumId = "sum_"+keyword; //金额值

			var remark = $(remarkId).value;    //备注

			var RexStr = /\#!end!#/g  ;        //去掉备注里的特殊字符串  #!end!#
    		remark = remark.replace(RexStr,"");

			RexStr =  /\#!!#/g ;       //去掉备注里的特殊字符串  #!&!#
       	 	remark = remark.replace(RexStr,"")

			itemPer += keyword+"#!!#"+$(FSId).value+"#!!#"+$(sumId).value+"#!!#"+remark+"#!e!#";
		}
		var per = itemPer;
 		    var requisitionId = $('requisitionId').value;
		var url = "${ctx}/renovation_renovateRequisitionAction.do?method=editRenovateChargeItems&requisitionId="+requisitionId;
		new Ajax.Request(url,
				         { method:'post',
						   parameters:{items:per},
						   onComplete:back
						 });

	}
	function back(response){

		setButtonStatus(true);
		ajaxSubmitException(response.responseText);

		findFrame('main').refleshRenReqFrame(); //刷新主页面列表
		windowClose();
	}

	function setButtonStatus(status){ //设置按钮状态 true 代表可用 false代表不可用
		$("btn1_22").disabled = !status;
		$("btn1_32").disabled = !status;
	}

</script>


</head>

<body onload="resize();">



<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td class="window_head_outBg">
	    <table border="0" cellpadding="0" cellspacing="0">
	      <tr><td><img src="${ctx}/images/ico_Advance.gif" width="16" height="16" align="absmiddle" /> <span class="window_head_intext">收费登记</span></td></tr>
	    </table>
	</td>
  </tr>
  <tr><td class="aux_header_line_1"></td></tr>
  <tr><td class="aux_header_line_2"></td></tr>
  <tr>
    <td class="content"><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
          <td class="aux_outtable_color"><table width="100%" border="0" cellpadding="0" cellspacing="1" class="aux_intable_color">

			  <tr>
			  <td class="aux_intable_td1">房 号：</td>
              <td class="aux_intable_td2">${requisitionVO.houseNumber }</td>
              <td class="aux_intable_td1">装修面积：</td>
              <td class="aux_intable_td2">${requisitionVO.area }&nbsp;㎡</td>
            </tr>
            <tr>
              <td class="aux_intable_td1">申请单号：</td>
              <td class="aux_intable_td2">${requisitionVO.requisitionNumber }</td>
              <td class="aux_intable_td1">审批状态：</td>
              <td class="aux_intable_td2">${requisitionVO.requisitionStateView }</td>
            </tr>
            <tr>
              <td class="aux_intable_td1">业主姓名：</td>
              <td class="aux_intable_td2">${requisitionVO.clientNames }</td>
              <td class="aux_intable_td1">&nbsp;</td>
              <td class="aux_intable_td2">&nbsp;</td>
            </tr>

            <tr><td colspan="4" class="aux_titletable">按金额收费</td></tr>
            <tr><td colspan="4" valign="top" class="aux_intable_td2">

<form id="reqChargeForm" name="reqChargeForm"  method="post" action=""  class="required-validate">
		<input id="requisitionId" name="requisitionId" value="${requisitionId}" type="hidden">
            <table width="100%" border="0" cellpadding="0" cellspacing="0" class="tab_line">
            <tr>
                <td valign="top">
                <table width="100%" border="0" cellspacing="0" cellpadding="0" >
                     <tr>
                       <td>

	<div style="overflow: auto; height: 105px">
                       <table width="100%" border="0" cellspacing="0" cellpadding="0" id="crmGrid" class="gridControl gridArea">
                            <tr>
                              <td width="5%" class="align_left"  onMouseOver="this.className='grid_sort_on align_left'" onMouseOut="this.className='align_left'"><span class="grid grid_head_line">&nbsp;</span></td>
                              <td width="15%" class="align_left"  onMouseOver="this.className='grid_sort_on align_left'" onMouseOut="this.className='align_left'"><span class="grid grid_head_line">收费项目</span></td>
                              <td width="20%" class="align_right" onMouseOver="this.className='grid_sort_on align_right'" onMouseOut="this.className='align_right'"><span class="grid grid_head_line">应收金额</span></td>
                              <td width="10%" class="align_left" onMouseOver="this.className='grid_sort_on align_left'" onMouseOut="this.className='align_left'"><span class="grid grid_head_line">费用状态</span></td>
                              <td width="15%" class="align_left" onMouseOver="this.className='grid_sort_on align_left'" onMouseOut="this.className='align_left'"><span class="grid grid_head_line">收费对象</span></td>
                              <td width="35%" class="align_left" onMouseOver="this.className='grid_sort_on align_left'" onMouseOut="this.className='align_left'">备 注</td>
                            </tr>
                        </table>

                        <table width="100%" border="0"  id="item_table" cellspacing="0" cellpadding="0" class='gridData2'>

                            <c:forEach items="${itemList}" var="item" >
							<tr class="grid" id="${item.keyword}">

                                <td width="5%" class="grid align_left">
	                                <c:choose>
	                                	<c:when test="${item.feeState =='001'  }">
	                                		<input name="ckS_${item.keyword}" id="ckS_${item.keyword}"  type="checkbox" value="${item.keyword}" checked="checked" onclick="ckOnclick('${item.keyword}')"/>
	                                	</c:when>
	                                	<c:when test="${item.feeState == '002' }">
	                                		<input name="ckS_${item.keyword}" id="ckS_${item.keyword}"  type="checkbox" value="${item.keyword}" onclick="ckOnclick('${item.keyword}')"/>
	                                	</c:when>
								    	<c:otherwise>
											<input name="ckS_${item.keyword}" id="ckS_${item.keyword}"  type="checkbox" value="${item.keyword}"  disabled="disabled" />
								    	</c:otherwise>
	                                </c:choose>
                                </td>

                                <td width="15%" class="grid align_left">${item.chargeItem}</td>
                                <td width="20%"  class="grid align_right">
                                	<input type="hidden" id="oldSum_${item.keyword}" name="oldSum_${item.keyword}" value="${item.sum}">
									<c:choose>
                               			<c:when test="${item.feeState =='001' || item.feeState == '002' }">
                               				<input  name="sum_${item.keyword}"
                               						id="sum_${item.keyword}"
                               						type="text"
                               						class="inputNoStyle1 required float-right integer-decimal-range-10-2"
                                    				onMouseOver="sumOver('${item.keyword}')"
                                 					onMouseOut="sumOut('${item.keyword}')"
                                    				value="${item.sum}"
                                    				style="text-align:right;width: 100px;"
													<c:if test="${item.feeState =='002'}">readonly="readonly"</c:if>
                                    				/>
                               			</c:when>
                               			<c:otherwise>
                               				<input name="sum_${item.keyword}"  id="sum_${item.keyword}" style="text-align:right;width: 100px;"
                               					type="text" value="${item.sum}" class="inputNoStyle1" readonly="readonly" />
                               			</c:otherwise>
                               		</c:choose>

                                </td>

                                <td width="10%"  class="grid align_left">
                               		<input id="FS_${item.keyword}" type="hidden" value="${item.feeState}">
                               		<span id="spS_${item.keyword}">${item.feeStateView }
                               		</span>
                                </td>

                                <td width="15%"  class="grid align_left">${item.chargeObjectView}</td>
                                <td width="35%"  id="tdR_${item.keyword}" class="grid align_left">
                               		<c:choose>
                               			<c:when test="${item.feeState =='001' || item.feeState == '002' }">
                               				<input  name="remark_${item.keyword}"
                               						id="remark_${item.keyword}"
                               						type="text"
                               						class="inputNoStyle1"
                                    				onMouseOver="remarkOver('${item.keyword}')"
                                 					onMouseOut="remarkOut('${item.keyword}')"
                                    				value="${item.remark}" size="30" maxlength="100"
                                    				/>
                               			</c:when>
                               			<c:otherwise>
                               				<input name="remark_${item.keyword}"  id="remark_${item.keyword}"
                               						type="text" value="${item.remark}" class="inputNoStyle1" readonly="readonly"  size="30" />
                               			</c:otherwise>
                               		</c:choose>
                                 </td>
                           </tr>
                          </c:forEach>
                       </table>
	</div>
                	</td>
               	</tr>
        	</table>
        	</td>
        </tr>
        </table>
</form>
        </td>
         </tr>
        </table></td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td class="window_footer"><table border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td><table border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td class="buttonOffLeft" id="btn1_21"></td>
              <td class="buttonOffMiddle" id="btn1_22" onClick="submitWin();" onMouseOver="btn_change_over(2)" onMouseOut="btn_change_out(2)" onBlur="btn_change(2)"><img src="${ctx}/images/ico_ok.gif" alt="" width="14" height="14" border="0" align="absbottom" /> 保 存</td>
              <td class="buttonOffRight" id="btn1_23"></td>
            </tr>
        </table></td>
        <td class="btn_between_space"></td>
        <td><table border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td class="buttonOffLeft" id="btn1_31"></td>
              <td class="buttonOffMiddle" id="btn1_32" onClick="windowClose();" onMouseOver="btn_change_over(3)" onMouseOut="btn_change_out(3)" onBlur="btn_change(3)"><img src="${ctx}/images/ico_cancel.gif" alt="" width="14" height="14" border="0" align="absbottom" /> 关 闭</td>
              <td class="buttonOffRight" id="btn1_33"></td>
            </tr>
        </table></td>
      </tr>
    </table></td>
  </tr>
</table>


<script type="text/javascript">
  /**
	* 功能描述： 给字符串去掉前后的空格
	*/
	String.prototype.trim = function(){
    		// 用正则表达式将前后空格
    		// 用空字符串替代。
   		 return this.replace(/(^\s*)|(\s*$)/g, "");
	}

</script>
</body>
</html>